import Vue from 'vue'
import VueRouter from 'vue-router'
import NProgress from 'nprogress'
import 'nprogress/nprogress.css'

const Home = () => import("../views/Home")
const Types = () => import("../views/Types")
const Tags = () => import("../views/Tags")
const Archives = () => import("../views/Archives")
const About = () => import("../views/About")
const Search = () => import("../views/Search")
const Blog = () => import("../views/Blog")

Vue.use(VueRouter)

const routes = [
  {
    path: '',
    redirect: '/home',
    component: Home,
  },
  {
    path: '/home',
    name: 'Home',
    component: Home,
    meta: {
      title: "首页"
    }
  },
  {
    path: '/types/',
    name: 'Types',
    component: Types,
    meta: {
      title: "分类"
    }
  },
  {
    path: '/tags',
    name: 'Tags',
    component: Tags,
    meta: {
      title: "标签"
    }
  },
  {
    path: '/archives',
    name: 'Archives',
    component: Archives,
    meta: {
      title: "归档"
    }
  },
  {
    path: '/about',
    name: 'About',
    component: About,
    meta: {
      title: "关于我"
    }
  },
  {
    path: '/search',
    name: 'Search',
    component: Search,
    meta: {
      title: "搜索结果"
    }
  },
  {
    path: '/blog/:blogId',
    name: 'Blog',
    component: Blog,
    meta: {
      title: "博客详情"
    },
  },
]

const router = new VueRouter({
  base: '/blog/',
  routes,
  mode: "history",
  linkActiveClass: "active"
})

NProgress.configure({ showSpinner: false })

/*路由跳转前调用*/
router.beforeEach((to, from, next) => {
  NProgress.start()
  document.title = to.meta.title;
  next();
})

router.afterEach(() => {
  NProgress.done()
})

export default router
